<html>
<head>
<style><!--
canvas {left: 10px; position: relative;padding: 2px;}
-->
</style>
<script src="cchart.js"></script>
<script>
	function draw(){
		var line1 = { "type": "line",
						"elements": [ { "values": [ 1, 2, 1, null, null, null, null, null ] } ],
						"title": { "text": "Fri Sep 09 2011" }
					};
		var line2 = { "type": "line",
						"elements": [ {  "values": [ 3, 3, 6, 1, 5, 1, 3, 3, 3 ],
											"dot-style": { "type": "solid-dot", "dot-size": 5, "colour": "#DFC329" },
											"width": 4, "colour": "#DFC329", "text": "Line 1", "font-size": 10 },
									  { "values": [ 11, 11, 12, 10, 11, 7, 9, 11, 9 ],
											"dot-style": { "type": "star", "dot-size": 5 },
											"width": 1, "colour": "#6363AC", "text": "Line 2", "font-size": 10 },
									  { "values": [ 17, 18, 16, 18, 19, 15, 17, 16, 16 ],
												"width": 1, "colour": "#5E4725", "text": "Line 3", "font-size": 10 }
									],
						"title": { "text": "Three lines example" },
						"y_axis": { "min": 0, "max": 20, "steps": 5 },
						legend: {border: true, type: "col"}
					}
		new CanvasChart("first", line1, 550, 200);
		new CanvasChart("second", line2, 550, 200);
//		new CanvasChart("three", bar3, 550, 200);
//		new CanvasChart("four", bar4, 550, 200);
	}
</script>
</head>
<body onload="draw();" ></body>
</html>